<%@page pageEncoding="utf-8"%>
<%@taglib uri="/struts-tags" prefix="s"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>达内－NetCTOSS</title>
        <link type="text/css" rel="stylesheet" media="all" href="../styles/global.css" />
        <link type="text/css" rel="stylesheet" media="all" href="../styles/global_color.css" />
        <script language="javascript" type="text/javascript" src="../js/jquery-1.4.3.js"></script>
        <script language="javascript" type="text/javascript">
        	var rPassF=false,rPassS=false;
        	var rIdcardNo=false,rUnixHost=false,rOsUserName=false;
            //保存成功的提示信息
            function showResult() {
            	if(!rIdcardNo){
            		$("#save_result_info").text("身份证输入有误，请修改后重试");
            		showResultDiv(true);
            		window.setTimeout("showResultDiv(false);", 3000);
            		return;
            	}else if(!rUnixHost){
            		$("#save_result_info").text("服务器IP输入有误，请修改后重试");
            		showResultDiv(true);
            		window.setTimeout("showResultDiv(false);", 3000);
            		return;
            	}else if(!rOsUserName){
            		$("#save_result_info").text("OS账号输入有误，请修改后重试");
            		showResultDiv(true);
            		window.setTimeout("showResultDiv(false);", 3000);
            		return;
            	}else if(!rPassF || !rPassS){
            		$("#save_result_info").text("密码输入有误，请修改后重试");
            		showResultDiv(true);
            		window.setTimeout("showResultDiv(false);", 3000);
            		return;
            	}
                showResultDiv(true);
                $("#save_result_info").text("已提交");
                window.setTimeout("showResultDiv(false);", 3000);
                document.forms[0].submit();
            }
            function showResultDiv(flag) {
                var divResult = document.getElementById("save_result_info");
                if (flag)
                    divResult.style.display = "block";
                else
                    divResult.style.display = "none";
            }

            //自动查询账务账号
            function searchAccount(){
            	var idcardNo = $("#idcardNo").val();
            	//校验身份证是否为空
            	if(idcardNo==null||idcardNo==""){
            		$("#idcardNoMsg").text("请输入身份证号！");
            		rIdcardNo = false;
            		return;
            	}
            	//校验身份证的格式
            	var reg = /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{4}$/;
            	if(!reg.test(idcardNo)){
            		$("#idcardNoMsg").text("请输入正确格式的身份证号！");
            		rIdcardNo = false;
            		return;
            	}
            	
            	$.post(
            		"/NETCTOSS_Pro/account/searchAccount",
            		{"idcardNo":idcardNo},
            		function(data){
            			var account = data;
            			if(account==null){
            				rIdcardNo = false;
            				$("#idcardNoMsg").text("找不到匹配的账务账号数据！");
            				$("#loginNameMsg").text("没有此账务账号，请重新录入。");
            			}else{
            				rIdcardNo = true;
            				$("#accountId").val(account.id);
            				$("#loginName").val(account.loginName);
            				$("#idcardNoMsg").text("");
            				$("#loginNameMsg").text("获取账务账号成功");
            			}
            		}
            	);
            }
            $(function(){
            	//IP地址
            	$("#unixHost").blur(function(){
            		var reg = /^\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}$/;
            		var id = $(this).val();
            		if(!reg.test(id)){
            			$("#unixHostMsg").text("请输入正确的IP地址");
            			rUnixHost=false;
            		}else{
            			$("#unixHostMsg").text("输入正确");
            			rUnixHost=true;
            		}
            	});
            	//OS账号
            	$("#osUserName").blur(function(){
            		var reg = /^[a-zA-Z0-9_]{1,8}$/;
            		var name = $(this).val();
            		if(!reg.test(name)){
            			$("#osUserNameMsg").text("请输入正确的登录账号");
            			rOsUserName=false;
            		}else{
            			$("#osUserNameMsg").text("输入正确");
            			rOsUserName=true;
            		}
            		if(name == null || name == ""){
            			$(this).val("创建即启用，状态为开通");
            		}
            	});
            	$("#osUserName").focus(function(){
            		var theText = $(this).val();
            		if(theText=="创建即启用，状态为开通"){
            			$(this).val("");
            		}
            	});
            	
            	$("#loginPasswd").blur(function(){
            		var passWord = $(this).val();
            		var reg = /^[\w]{1,30}$/;
            		if(!reg.test(passWord)){
            			$("#loginPasswdMsg").text("请输入正确的密码");
            			rPassF=false;
            			return;
            		}else{
            			$("#loginPasswdMsg").text("输入正确");
            			rPassF=true;
            		}
            		if(passWord != $("#reLoginPasswd").val()){
            			$("#reLoginPasswdMsg").text("请输入与上面相同的密码");
            			rPassS=false;
            		}else if(passWord == $("#reLoginPasswd").val()){
            			$("#reLoginPasswdMsg").text("输入正确");
            			rPassS=true;
            		}
            	});
            	//重复密码
            	$("#reLoginPasswd").blur(function(){
            		var passW = $("#loginPasswd").val();
            		var rePassW = $(this).val();
            		if(passW != rePassW){
            			$("#reLoginPasswdMsg").text("您输入的密码与上面不同");
            			rPassS=false;
            			return;
            		}else{
            			if(rePassW!=null&&rePassW!=""){
	            			$("#reLoginPasswdMsg").text("输入正确");
	            			rPassS=true;
            			}else{
            				$("#reLoginPasswdMsg").text("请输入密码");
            				rPassS=false;
            			}
            		}
            	});
            });
        </script>
    </head>
    <body>
        <!--Logo区域开始-->
        <div id="header">
            <img src="../images/logo.png" alt="logo" class="left"/>
            <a href="#">[退出]</a>            
        </div>
        <!--Logo区域结束-->
        <!--导航区域开始-->
        <div id="navi">
            <ul id="menu">
                <li><a href="../index/index" class="index_off"></a></li>
                <li><a href="../role/findRole" class="role_off"></a></li>
                <li><a href="../admin/findAdmin" class="admin_off"></a></li>
                <li><a href="../cost/findCost" class="fee_off"></a></li>
                <li><a href="../account/findAccount" class="account_off"></a></li>
                <li><a href="../service/findService" class="service_on"></a></li>
                <li><a href="../bill/findBill" class="bill_off"></a></li>
                <li><a href="../report/findReport" class="report_off"></a></li>
                <li><a href="../user/userInfo" class="information_off"></a></li>
                <li><a href="../user/userModiPwd" class="password_off"></a></li>
            </ul>
        </div>
        <!--导航区域结束-->
        <!--主要区域开始-->
        <div id="main">
            <!--保存操作的提示信息-->
            <div id="save_result_info" class="save_fail">保存失败！192.168.0.23服务器上已经开通过 OS 账号 “mary”。</div>
            <form action="addService" method="post" class="main_form">
                <!--内容项-->
                <div class="text_info clearfix"><span>身份证：</span></div>
                <div class="input_info">
                    <input type="text" class="width180" id="idcardNo" name="service.idcardNo"/>
                    <input type="hidden" id="accountId"/>
                    <input type="button" value="查询账务账号" class="btn_search_large" onclick="searchAccount();"/>
                    <span class="required">*</span>
                    <div class="validate_msg_short" id="idcardNoMsg"></div>
                </div>
                <div class="text_info clearfix"><span>账务账号：</span></div>
                <div class="input_info">
                    <input type="text" id="loginName" readonly="readonly" onkeyup="searchAccounts(this);" class="readonly"/>
                    <span class="required">*</span>
                    <div class="validate_msg_long" id="loginNameMsg">请点击“查询账务账号”</div>
                </div>
                <div class="text_info clearfix"><span>资费类型：</span></div>
                <div class="input_info">
                    <s:select name="service.costId" list="costs" listKey="id" listValue="name"></s:select>                      
                </div> 
                <div class="text_info clearfix"><span>服务器 IP：</span></div>
                <div class="input_info">
                    <input type="text" id="unixHost" name="service.unixHost"/>
                    <span class="required">*</span>
                    <div class="validate_msg_long" id="unixHostMsg">15 长度，符合IP的地址规范</div>
                </div>                   
                <div class="text_info clearfix"><span>登录 OS 账号：</span></div>
                <div class="input_info">
                    <input type="text" value="创建即启用，状态为开通" id="osUserName" name="service.osUserName"/>
                    <span class="required">*</span>
                    <div class="validate_msg_long" id="osUserNameMsg">8长度以内的字母、数字和下划线的组合</div>
                </div>
                <div class="text_info clearfix"><span>密码：</span></div>
                <div class="input_info">
                    <input type="password" id="loginPasswd" name="service.loginPassword"/>
                    <span class="required">*</span>
                    <div class="validate_msg_long" id="loginPasswdMsg">30长度以内的字母、数字和下划线的组合</div>
                </div>
                <div class="text_info clearfix"><span>重复密码：</span></div>
                <div class="input_info">
                    <input type="password" id="reLoginPasswd" />
                    <span class="required">*</span>
                    <div class="validate_msg_long" id="reLoginPasswdMsg">两次密码必须相同</div>
                </div>     
                <!--操作按钮-->
                <div class="button_info clearfix">
                    <input type="button" value="保存" class="btn_save" onclick="showResult();" />
                    <input type="button" value="取消" class="btn_save" onclick="javascript:history.go(-1)"/>
                </div>
            </form>
        </div>
        <!--主要区域结束-->
        <div id="footer">
            <span>[源自北美的技术，最优秀的师资，最真实的企业环境，最适用的实战项目]</span>
            <br />
            <span>版权所有(C)加拿大达内IT培训集团公司 </span>
        </div>
    </body>
</html>
